<style lang="less" scoped src="./orgTable.less"></style>
<style lang="less" scoped src="../../public.less"></style>
<style>
    td.ivu-table-expanded-cell{
        padding: 1px 1px;
    }
</style>
<script src="./orgTbale.js"></script>

<template>
    <div>
        <div class="main-table">
            <Table :columns="columns" :data="dataList" :show-header="parentid == ''"></Table>
        </div>
        <div class="pagination" v-if="parentid == ''">
            <Page :total="total" size="small" :page-size="pageSize" :current.sync="pageIndex" @on-change="loadList"
                  show-total show-elevator></Page>
        </div>
        <Modal
                v-model="editModal"
                :title="(isRead ? '查看' : (childForm.id ? '修改' : '新增')) + '机构'"
                @on-ok="editModal = false"
                @on-cancel="editModal = false"
                :mask-closable="isRead"
                :closable="isRead"
                width="70%"
                :styles="{top: '20px'}">
            <div class="modal-div">
                <Row>
                    <Col span="4" class="table-row-title">
                    <span style="color: red">*</span>归属区域：
                    </Col>
                    <Col span="20" class="table-row-content">
                    <select-city ref="editCity" :cityinfo="editCity" :disabled="isRead"></select-city>
                    </Col>
                </Row>
                <Row>
                    <Col span="4" class="table-row-title"><span style="color: red">*</span>机构名称：</Col>
                    <Col span="8" class="table-row-content">
                    <Input v-model="formData.name" :clearable="!isRead" :readonly="isRead" ></Input>
                    </Col>
                    <Col span="4" class="table-row-title"><span style="color: red">*</span>排序：</Col>
                    <Col span="8" class="table-row-content">
                    <Input v-model="formData.orders" :clearable="!isRead" :readonly="isRead" ></Input>
                    </Col>
                </Row>
                <Row>
                    <Col span="4" class="table-row-title">上级机构：</Col>
                    <Col span="8" class="table-row-content">
                    <Select v-model="formData.parentid" :disabled="true">
                        <Option v-for="item in orgList" :value="item.id" :key="item.id">{{item.name}}</Option>
                    </Select>
                    </Col>
                    <Col span="4" class="table-row-title">使用性质：</Col>
                    <Col span="8" class="table-row-content">
                    <Select v-model="formData.usetype" :clearable="!isRead" :disabled="isRead">
                        <Option :value="1">正式</Option>
                        <Option :value="2">试用</Option>
                    </Select>
                    </Col>
                </Row>
                <Row>
                    <Col span="4" class="table-row-title">机构类型：</Col>
                    <Col span="8" class="table-row-content">
                    <Select v-model="formData.type" :disabled="true">
                        <Option :value="1">机构</Option>
                        <Option :value="2">部门</Option>
                    </Select>
                    </Col>
                    <Col span="4" class="table-row-title">机构性质：</Col>
                    <Col span="8" class="table-row-content">
                    <Select v-model="formData.natureid" :clearable="!isRead" :disabled="isRead">
                        <Option v-for="item in natureList" :value="item.id" :key="item.id">{{item.name}}</Option>
                    </Select>
                    </Col>
                </Row>
                <Row>
                    <Col span="4" class="table-row-title">英文别名：</Col>
                    <Col span="8" class="table-row-content">
                    <Input v-model="formData.ename" :clearable="!isRead" :readonly="isRead" ></Input>
                    </Col>
                    <Col span="4" class="table-row-title">联系地址：</Col>
                    <Col span="8" class="table-row-content">
                    <Input v-model="formData.address" :clearable="!isRead" :readonly="isRead" ></Input>
                    </Col>
                </Row>
                <Row>
                    <Col span="4" class="table-row-title">邮政编码：</Col>
                    <Col span="8" class="table-row-content">
                    <Input v-model="formData.postal" :clearable="!isRead" :readonly="isRead" ></Input>
                    </Col>
                    <Col span="4" class="table-row-title">机构电话：</Col>
                    <Col span="8" class="table-row-content">
                    <Input v-model="formData.orgphone" :clearable="!isRead" :readonly="isRead" ></Input>
                    </Col>
                </Row>
                <Row>
                    <Col span="4" class="table-row-title">机构组织机构代码证：</Col>
                    <Col span="8" class="table-row-content">
                        <Upload ref="codepapers"
                                :action="SERVER_HOST + 'upload/uploadFile'"
                                :show-upload-list="false"
                                :default-file-list="codepapersList"
                                :format="['bmp','gif','jpeg','tiff','png','jpg']"
                                :max-size="2048"
                                :on-exceeded-size="handleMaxSize"
                                :on-format-error="handleFormatError"
                                :on-success="handleSuccess"
                                :before-upload="handleBeforeUpload">
                            <Button type="ghost" icon="ios-cloud-upload-outline"
                                    @click="uploadClick('codepapers','codepapersList')"
                                    :disabled="butSave||isRead">上传图片</Button>
                        </Upload>
                    </Col>
                    <Col span="4" class="table-row-title"></Col>
                    <Col span="8" class="table-row-content">
                    <div class="admin-upload-list"  v-for="(item, index) in codepapersList">
                        <template v-if="item.status === 'finished'">
                            <img :src="item.url">
                            <div class="admin-upload-list-cover" style="margin: 0">
                                <Icon type="ios-eye-outline" @click.native="showImg(item.url)"></Icon>
                                <Icon type="ios-trash-outline" @click.native="handleRemove('codepapers','codepapersList', item, index)" :style="'display:'+ (isRead ? 'none':'inline')"></Icon>
                            </div>
                        </template>
                        <template v-else>
                            <Spin fix v-if="item.showProgress">
                                <Icon type="load-c" size=18 class="demo-spin-icon-load"></Icon>
                            </Spin>
                        </template>
                    </div>
                    </Col>
                </Row>
                <Row>
                    <Col span="4" class="table-row-title">机构营业执照：</Col>
                    <Col span="8" class="table-row-content">
                    <Upload ref="business"
                            :action="SERVER_HOST + 'upload/uploadFile'"
                            :show-upload-list="false"
                            :default-file-list="businessList"
                            :format="['bmp','gif','jpeg','tiff','png','jpg']"
                            :max-size="2048"
                            :on-exceeded-size="handleMaxSize"
                            :on-format-error="handleFormatError"
                            :on-success="handleSuccess"
                            :before-upload="handleBeforeUpload">
                        <Button type="ghost" icon="ios-cloud-upload-outline"
                                @click="uploadClick('business','businessList')"
                                :disabled="butSave||isRead">上传图片</Button>
                    </Upload>
                    </Col>
                    <Col span="4" class="table-row-title"></Col>
                    <Col span="8" class="table-row-content">
                    <div class="admin-upload-list"  v-for="item in businessList">
                        <template v-if="item.status === 'finished'">
                            <img :src="item.url">
                            <div class="admin-upload-list-cover" style="margin: 0">
                                <Icon type="ios-eye-outline" @click.native="showImg(item.url)"></Icon>
                                <Icon type="ios-trash-outline" @click.native="handleRemove('business','businessList', item)" :style="'display:'+ (isRead ? 'none':'inline')"></Icon>
                            </div>
                        </template>
                        <template v-else>
                            <Spin fix v-if="item.showProgress">
                                <Icon type="load-c" size=18 class="demo-spin-icon-load"></Icon>
                            </Spin>
                        </template>
                    </div>
                    </Col>
                </Row>
                <Row>
                    <Col span="4" class="table-row-title">机构法人证：</Col>
                    <Col span="8" class="table-row-content">
                    <Upload ref="legalperson"
                            :action="SERVER_HOST + 'upload/uploadFile'"
                            :show-upload-list="false"
                            :default-file-list="legalpersonList"
                            :format="['bmp','gif','jpeg','tiff','png','jpg']"
                            :max-size="2048"
                            :on-exceeded-size="handleMaxSize"
                            :on-format-error="handleFormatError"
                            :on-success="handleSuccess"
                            :before-upload="handleBeforeUpload">
                        <Button type="ghost" icon="ios-cloud-upload-outline"
                                @click="uploadClick('legalperson','legalpersonList')"
                                :disabled="butSave||isRead">上传图片</Button>
                    </Upload>
                    </Col>
                    <Col span="4" class="table-row-title"></Col>
                    <Col span="8" class="table-row-content">
                    <div class="admin-upload-list"  v-for="item in legalpersonList">
                        <template v-if="item.status === 'finished'">
                            <img :src="item.url">
                            <div class="admin-upload-list-cover" style="margin: 0">
                                <Icon type="ios-eye-outline" @click.native="showImg(item.url)"></Icon>
                                <Icon type="ios-trash-outline" @click.native="handleRemove('legalperson','legalpersonList', item)" :style="'display:'+ (isRead ? 'none':'inline')"></Icon>
                            </div>
                        </template>
                        <template v-else>
                            <Spin fix v-if="item.showProgress">
                                <Icon type="load-c" size=18 class="demo-spin-icon-load"></Icon>
                            </Spin>
                        </template>
                    </div>
                    </Col>
                </Row>
                <Row>
                    <Col span="4" class="table-row-title">负责人：</Col>
                    <Col span="8" class="table-row-content">
                    <Input v-model="formData.contacts" :clearable="!isRead" :readonly="isRead" ></Input>
                    </Col>
                    <Col span="4" class="table-row-title">负责人电话：</Col>
                    <Col span="8" class="table-row-content">
                    <Input v-model="formData.phone" :clearable="!isRead" :readonly="isRead" ></Input>
                    </Col>
                </Row>
                <Row>
                    <Col span="4" class="table-row-title">邮箱：</Col>
                    <Col span="8" class="table-row-content">
                    <Input v-model="formData.email" :clearable="!isRead" :readonly="isRead" ></Input>
                    </Col>
                    <Col span="4" class="table-row-title">传真：</Col>
                    <Col span="8" class="table-row-content">
                    <Input v-model="formData.fax" :clearable="!isRead" :readonly="isRead" ></Input>
                    </Col>
                </Row>
                <Row>
                    <Col span="4" class="table-row-title">备注：</Col>
                    <Col span="20" class="table-row-content">
                    <Input type="textarea" :rows="2" v-model="formData.remark" :clearable="!isRead" :readonly="isRead"></Input>
                    </Col>
                </Row>
                <Row>
                    <Col span="4" class="table-row-title"><span style="color: red">*</span>合同生效开始日期：</Col>
                    <Col span="8" class="table-row-content">
                    <DatePicker v-model="formData.contractstartdate" :clearable="!isRead" :readonly="isRead" :editable="false" style="width: 100%"></DatePicker>
                    </Col>
                    <Col span="4" class="table-row-title"><span style="color: red">*</span>合同生效结束日期：</Col>
                    <Col span="8" class="table-row-content">
                    <DatePicker v-model="formData.contractenddate" :clearable="!isRead" :readonly="isRead" :editable="false" style="width: 100%"></DatePicker>
                    </Col>
                </Row>
                <Row>
                    <Col span="4" class="table-row-title"><span style="color: red">*</span>费用有效开始日期：</Col>
                    <Col span="8" class="table-row-content">
                    <DatePicker v-model="formData.chargestartdate" :clearable="!isRead" :readonly="isRead" :editable="false" style="width: 100%"></DatePicker>
                    </Col>
                    <Col span="4" class="table-row-title"><span style="color: red">*</span>费用有效结束日期：</Col>
                    <Col span="8" class="table-row-content">
                    <DatePicker v-model="formData.chargeenddate" :clearable="!isRead" :readonly="isRead" :editable="false" style="width: 100%"></DatePicker>
                    </Col>
                </Row>
                <Row>
                    <Col span="4" class="table-row-title">费用（*/年）：</Col>
                    <Col span="8" class="table-row-content">
                    <Input v-model="formData.charge" :clearable="!isRead" :readonly="isRead" ></Input>
                    </Col>
                    <Col span="4" class="table-row-title">签约年限(年)：</Col>
                    <Col span="8" class="table-row-content">
                    <Input v-model="formData.term" :clearable="!isRead" :readonly="isRead" ></Input>
                    </Col>
                </Row>
                <Row>
                    <Col span="4" class="table-row-title">合同文本：</Col>
                    <Col span="8" class="table-row-content">
                    <Upload ref="contract"
                            :action="SERVER_HOST + 'upload/uploadFile'"
                            :show-upload-list="false"
                            :default-file-list="contractList"
                            :format="['doc','docx','dot','dotx','docm']"
                            :max-size="2048"
                            :on-exceeded-size="handleMaxSize"
                            :on-format-error="handleFormatError"
                            :on-success="handleSuccess"
                            :before-upload="handleBeforeUpload">
                        <Button type="ghost" icon="ios-cloud-upload-outline"
                                @click="uploadClick('contract','contractList')"
                                :disabled="butSave||isRead">上传附件</Button>
                    </Upload>
                    </Col>
                    <Col span="4" class="table-row-title"></Col>
                    <Col span="8" class="table-row-content">
                    <div v-for="item in contractList">
                        <a :href="item.url"><Icon type="archive"></Icon>下载</a>
                    </div>
                    </Col>
                </Row>
            </div>
            <div slot="footer">
                <Button type="primary" @click="save" :disabled="butSave" :style="'display:'+ (isRead ? 'none':'inline')">保存</Button>
                <Button type="ghost" style="margin-left: 8px" @click="editModal = false">取消</Button>
            </div>
        </Modal>
        <Modal v-model="imgModal">
            <img :src="imgPath" width="100%" height="100%">
        </Modal>
        <Modal
                v-model="childModal"
                :title="(isRead ? '查看' : (childForm.id ? '修改' : '新增')) + '机构'"
                @on-ok="childModal = false"
                @on-cancel="childModal = false"
                :mask-closable="isRead"
                :closable="isRead"
                width="70%">
            <div>
                <Row>
                    <Col span="4" class="table-row-title"><span style="color: red">*</span>上级机构：</Col>
                    <Col span="8" class="table-row-content">
                    <Input v-model="childForm.parentname" :disabled="true"></Input>
                    </Col>
                    <Col span="4" class="table-row-title"><span style="color: red">*</span>机构名称：</Col>
                    <Col span="8" class="table-row-content">
                    <Input v-model="childForm.name" :clearable="!isRead" :readonly="isRead"></Input>
                    </Col>
                </Row>
                <Row>
                    <Col span="4" class="table-row-title"><span style="color: red">*</span>排序：</Col>
                    <Col span="8" class="table-row-content">
                    <Input v-model="childForm.orders" :clearable="!isRead" :readonly="isRead" ></Input>
                    </Col>
                    <Col span="4" class="table-row-title">机构类型：</Col>
                    <Col span="8" class="table-row-content">
                    <Select v-model="childForm.type" :disabled="true">
                        <Option :value="1">机构</Option>
                        <Option :value="2">部门</Option>
                    </Select>
                    </Col>
                </Row>
                <Row>
                    <Col span="4" class="table-row-title">联系地址：</Col>
                    <Col span="8" class="table-row-content">
                    <Input v-model="childForm.address" :clearable="!isRead" :readonly="isRead"></Input>
                    </Col>
                    <Col span="4" class="table-row-title">邮政编码：</Col>
                    <Col span="8" class="table-row-content">
                    <Input v-model="childForm.postal" :clearable="!isRead" :readonly="isRead"></Input>
                    </Col>
                </Row>
                <Row>
                    <Col span="4" class="table-row-title">机构电话：</Col>
                    <Col span="8" class="table-row-content">
                    <Input v-model="childForm.orgphone" :clearable="!isRead" :readonly="isRead"></Input>
                    </Col>
                    <Col span="4" class="table-row-title">负责人：</Col>
                    <Col span="8" class="table-row-content">
                    <Input v-model="childForm.contacts" :clearable="!isRead" :readonly="isRead" ></Input>
                    </Col>
                </Row>
                <Row>
                    <Col span="4" class="table-row-title">负责人电话：</Col>
                    <Col span="8" class="table-row-content">
                    <Input v-model="childForm.phone" :clearable="!isRead" :readonly="isRead" ></Input>
                    </Col>
                    <Col span="4" class="table-row-title">邮箱：</Col>
                    <Col span="8" class="table-row-content">
                    <Input v-model="childForm.email" :clearable="!isRead" :readonly="isRead" ></Input>
                    </Col>
                </Row>
                <Row>
                    <Col span="4" class="table-row-title">传真：</Col>
                    <Col span="8" class="table-row-content">
                    <Input v-model="childForm.fax" :clearable="!isRead" :readonly="isRead" ></Input>
                    </Col>
                    <Col span="4" class="table-row-title">备注：</Col>
                    <Col span="8" class="table-row-content">
                    <Input type="textarea" :rows="2" v-model="childForm.remark" :clearable="!isRead" :readonly="isRead"></Input>
                    </Col>
                </Row>
            </div>
            <div slot="footer">
                <Button type="primary" @click="saveChild" :disabled="butSave" :style="'display:'+ (isRead ? 'none':'inline')">保存</Button>
                <Button type="ghost" style="margin-left: 8px" @click="childModal = false">取消</Button>
            </div>
        </Modal>
    </div>
</template>
